<template>
	<view class="container">
		<uni-card :title="planner.plannerName" :sub-title="planner.plannerBrief" :thumbnail="planner.plannerPhoto" note="Tips">
		</uni-card>
		<uni-section title="成绩指标" sub-title="" type="line">
			<uni-list>
				<uni-list-item title="总粉丝数" :rightText="plannerInfo.totalFans"></uni-list-item>
				<uni-list-item title="总投资额" :rightText="plannerInfo.totalAmount"></uni-list-item>
				<uni-list-item title="总收益金额" :rightText="plannerInfo.totalProfit"></uni-list-item>
				<uni-list-item title="有效粉丝" :rightText="plannerInfo.validFans"></uni-list-item>
			</uni-list>
		</uni-section>
		<view class="foot-bar">
			<uni-fav :checked="followed" @click="follow" :contentText="{contentDefault: '关注',contentFav: '取消关注'}"></uni-fav>
		</view>
	</view>
</template>

<script setup>
import { onMounted, ref } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { fetchPlannerInvestIndicator } from '../../api/planner.js'

const planner = ref({
	plannerName: '造梦大师',
	plannerBrief: '我很牛B',
	plannerPhoto: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png'
})
const plannerInfo = ref({})

const followed = ref(false)
const follow = () => {
	followed.value = !followed.value
	uni.showToast({
		title: followed.value ? "关注成功" : "取消成功"
	})
}

onMounted(async() => {
	
})

onLoad(async(query) => {
	const { success, data } = await fetchPlannerInvestIndicator(query.id)
	if (success) {
		plannerInfo.value = data
	}
})
</script>

<style scoped lang="scss">
.foot-bar {
	margin-top: .2rem;
	margin-left: calc(50vw - 30px);
}
</style>
